/* 网站主题色 */
@themeColor:#e92322;

/* 头部开始 */
.wjs_header{
    height: 50px;
    border-bottom: 1px solid #ccc;
    > .container {
        height: 100%;
        >.row{
            height: 100%;
            >div{
                height: 100%;
                line-height: 50px;
                text-align: center;
                font-size: 14px;
                &:nth-of-type(-n+3){
                    border-right: 1px solid #ccc;    
                }
                > .btn:first-of-type{
                    background-color: @themeColor;
                }
                > .btn-danger{
                    padding: 3px 16px;
                }
                > .btn-link{
                    color: black;
                }
            }

            > .wjs_code{
                position: relative;
                > img {
                    display: none;
                    position: absolute;
                    top: 49px;
                    left: 50%;
                    // margin-left: -60px;
                    transform: translateX(-50%);
                    border: 1px solid #ccc;
                    border-top: none;
                    z-index: 999;
                }
                &:hover {
                    > img {
                        display: block;
                    }
                }
            }
          
        }
    }
  
}
/* 头部结束 */

/* 导航开始 */
.wjs_nav{
    &.navbar {
        margin-bottom: 0;
    }
     .navbar-brand{
        height: 80px;
        line-height:50px;
        font-size: 40px;
        >span:first-of-type{
            color: @themeColor;
        }
        >span:last-of-type{
            color: #333;
        }
    } 
    
    .navbar-nav {
        >li{
            font-size: 16px;
            >a{
                &:hover,&:focus{
                    border-bottom: 2px solid @themeColor;
                }
                line-height: 50px; 
            }

            &.active {
                >a,a:hover,a:focus{
                    color: #333;
                    background-color: transparent;  
                    border-bottom: 2px solid @themeColor;
                }
            }
           
        }
       
    }

    .navbar-toggle{
        margin-top: 23px;
    }
}
/* 导航结束 */

/* 轮播图开始 */
.wjs_banner{
    .mobileImg{
     display: block;
      width: 100%;
      >img {
        display: block;
        width: 100%;
      }
    }
    .pcImg{
        display: block;
        width: 100%;
        height: 410px;
        background-position: center center;
        background-size:cover;
        background-repeat:no-repeat;
  
      }
}
/* 轮播图结束 */

/* 信息开始 */
.wjs_info{
    padding: 30px;
    .wjs_icon{
        font-size: 30px;
    }
    .row {
        >div{
            margin-top: 20px;
            >a:hover{
                color: @themeColor;
            }
        }
    }
}
/* 信息结束 */

/* 预约开始 */
.wjs_order{
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    .row {
        div{
            >a{
                line-height: 60px;
                &:hover{
                    color: @themeColor;
                }
            }
            .wjs_order_now{
                color: @themeColor;
                border-bottom: 1px dashed @themeColor;
            }
            .wjs_icon {
                font-size: 18px;
            }
        }
    }
}
/* 预约结束 */

/* 产品开始 */
.wjs_products{
    padding: 20px;
    background-color: #eee;
    overflow: hidden;
    .nav-tabs{
        >li{
            margin-bottom: 0px;
            padding-right: 30px;
            >a{
               border: none; 
               border-radius: 0px;
               line-height: 50px;
            }
            >a:hover{
                border: none;
                border-bottom: 3px solid @themeColor;
            }
            &.active{
              >a,a:hover,a:focus{
                  background-color: #eee;
                  border: none;
                  border-bottom: 3px solid @themeColor;
              }  
            }
        }
    }

    .pBox{
        margin-top: 20px;
        position: relative;
        padding-right: 100px;
        background-color: #fff;
        >.pLeft{
            width: 100%;
            height: 150px;
            // background-color: red;
            >.wjs_p_title{
                text-align: center;
                font-size: 14px;
                font-weight: normal;
                padding-top: 10px;
            }
            >.row{
                >div{
                    >p{
                        font-size: 12px;
                    }
                }
                >div:nth-of-type(even){
                    >p{
                        text-align: right;
                        padding-right: 5px;
                    }
                }
                >div:nth-of-type(odd){
                    >p{
                        padding-left: 5px;
                    }
                }
            }
        }
        >.pRight{
            width: 100px;
            height: 150px;
            // background-color: blue;
            position: absolute;
            top: 0;
            right: 0;
            text-align: center;
            padding-top: 30px;
            border-left: 1px dashed #ccc;
            >span{
                font-size: 40px;
                color: @themeColor;
                font-weight: 700;
            }
            >sub{
               color: @themeColor; 
               bottom: 0px;
            }
            &::before,&::after{
                content: "";
                width: 10px;
                height: 10px;
                border-radius: 50%;
                border: 1px solid #eee;
                position: absolute;
                left: -5px;
                background-color: #eee;
            }
            &::before{
                top: -5px;
                box-shadow: 0px -1px 1px #ddd inset;
            }
            &::after{
                bottom: -5px;
                box-shadow: 0px 1px 1px #ddd inset;
            }

            >.wjs_tips{
                position: absolute;
                top: 20px;
                left: 0;
                width: 100%;
                text-align: center;
                >span{
                    cursor: pointer;
                }
                >span:first-of-type{
                    border: 1px solid green;
                    color:green;
                }
                >span:last-of-type{
                    border: 1px solid red;
                    color: red;
                }
            }

        }
        &.active{
            background-color: @themeColor;
            color: #fff;
            position: relative;
            >.pRight{
                >span{
                    color:#fff
                }
                >sub{
                    color: #fff;
                }
            }

            &::before{
                content: '\e915';
                font-family: 'wjs';
                font-size: 24px;
                position: absolute;
                top: -5px;
                left: 0;
            }
        }
    }

}
/* 产品结束 */

/* 新闻开始 */
.wjs_news{
   padding: 20px; 
   .wjs_news_title{
       border-bottom: 1px solid #ccc;
       text-align: center;
       line-height: 50px;
       position: relative;
       &::before{
           content: "";
           width: 8px;
           height: 8px;
           border-radius: 50%;
           border: 1px solid #ccc;
           position: absolute;
           bottom: -4px;
           right: -8px;
       }
   }
   .wjs_news_line_parent{
       position: relative;
   }
   .wjs_news_line{
    width: 1px;
    height: 100%;
    border-left: 1px dashed @themeColor;
    position: absolute;
    top: 0;
    left: 45px;
   }
   .nav-tabs{
       border-bottom: none;
       position: relative;
       >li{
           margin-bottom: 60px;
           >a{
               width: 60px;
               height: 60px;
               border-radius: 50%;
               border: none;
               background-color: #ccc;
               >span{
                   font-size: 30px;
                   color: #fff;
               }
           }
           a:hover{
            border: none; 
            background-color: @themeColor;
           }
           &.active{
               >a,a:hover,a:focus{
                  border: none; 
                  background-color: @themeColor;
               }
           }
           &:last-of-type{
               margin-bottom: 0px;
           }
       }

     /*   &::before{
           content: "";
           width: 1px;
           height: 100%;
           border-left: 1px dashed @themeColor;
           position: absolute;
           top: 0;
           left: 30px;
       } */

       @media screen and (max-width:992px) and (min-width:768px) {
           >li{
               margin: 20px 30px;
           }
       }
       @media screen and (max-width:768px) {
           >li{
               margin: 20px 0px;
               width: 25%;
           }
       }
   }

   .tab-content{
      .wjs_news_list{
          list-style: none;
          >li{
              line-height: 60px;
          }
      } 
   }
}
/* 新闻结束 */

/* 合作伙伴开始 */
.wjs_partner{
    background-color: #eee;
    padding: 20px;
    text-align: center;
    .wjs_partner_title{
        width: 100%;
        text-align: center;
    }
    .wjs_partner_list{
        list-style: none;
        display: inline-block;
        >li{
            float: left;
            margin-right: 20px;
            &:last-of-type{
                margin-right: 0px;
            }
            >.wjs_icon{
                font-size: 80px;
            }
        }
    }
}
/* 合作伙伴结束 */